@charset "utf-8";

/* header layout */
.m-header {
    position: relative;
    width: 100%;
    // background-color: #f3f3f3;
    border-bottom: 1px solid #dedede;
    margin-bottom: 1rem;
    background-color: #f9f9f9;
    background-image: linear-gradient(#f8f8f8,#f5f5f5);


    .site-title{
        padding: .3rem 0 .4rem 0;
    }
    .site-name{
        font-size: .22rem;
        margin-bottom: .2rem;
    }
    .site-slogan{
        color: inherit;      
        font-size: .14rem;
    }
    a{
        color: inherit;        
        display: inline-block;
        &:hover,&.active{
            color: red;
        }
    }
    .site-nav{
        padding-bottom: .1rem; 
        ul{
            list-style: none;
        }
        li {
            font-size: .14rem;
            display: inline;
            margin-right: .2rem;
        }
        i {
            padding-right: .5em;
        }
    }
}

@media screen and (max-width: 768px) {
    .m-header {
        .site-nav{
            li {
                margin-right: .2rem;
            }
        }
    }
}

@media screen and (max-width: 430px) {
    .m-header {
        .site-nav{
            li {
                margin-right: .1rem;
            }
        }
    }
}
